<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"  %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="en">
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";
%>
    <head>
        <meta charset="utf-8">	
        <meta http-equiv="X-UA-Compatible" content="IE=11">
        <link rel="stylesheet" href="<%=basePath %>client/css/cssreset.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/salejihui/css/pagination.css">
        <link rel="stylesheet" href="<%=basePath %>client/css/style.css">
        <link rel="stylesheet" href="<%=basePath %>client/css/style2.css">
        <link rel="stylesheet" href="<%=basePath%>css/mycss.css"> 
        <link rel="stylesheet" href="<%=basePath%>css/mystyle.css">
        <script src="<%=basePath %>client/js/jquery-1.11.1.min.js"></script>
        <script src="<%=basePath%>js/jquery.pagination.js"></script>
        <style type="text/css">
		   	#pageaaa a{
			        width: 23px;
			        height: 23px;
			        border: 1px solid #dce0e0;
			        text-align: center;
			        margin: 0 4px;
			        cursor: pointer;
			        display: inline-block;
			        font-size: 17px;
			    }
			    .current{
			        background-color: #5ac3e7;
			    }
			    
			    .bianji1{
				width: 552px;
				height: 369px;
				border:1px solid #ccc;
				border-radius:5px;
				position:absolute;
				top:110px;
				left:50%;
				margin-left:-260px;
				background:#fff;
				display:none;
				z-index:1;
			}
			.bianji1>p{
				width:100%;
				line-height:42px;
				text-indent:2em;
				color:#818181;
				border-bottom:1px solid #dddddd;
			}
			.bianji1>p>img{
				cursor:pointer;
				position:relative;
				left:426px;
			}
			.bianji1>form>p{
				text-align:center;
				margin-bottom:21px;
				color:#555555;
				overflow:hidden;
			}
			.bianji1>form>p>span:nth-of-type(2){
				color:red;
				margin-left:10px;
			}
			
			.bianji1>form>p:nth-of-type(1){
				margin-top:19px;
				
			}
			.bianji1>form>p>input{
				float:none;
				width:300px;
				height:28px;
				text-align:left;
				margin-left:50px;
				outline:none;
				border:1px solid #ccc;
				border-radius:5px;
			}
			
			.bianji1>form>p:nth-of-type(7){
				width:100%;
				height:32px;
				background:#dfe4ea;
				padding:10px 0;
			}
			.bianji1>form>p:nth-of-type(7)>input{
				width: 56px;
				line-height: 28px;
				background:#57c049;
				border:none;
				border-radius:5px;
				color:#fff;
				position:relative;
				left:160px;
				cursor:pointer;
				text-align:center;
			}
			.bianji1>form>p:nth-of-type(7)>input:nth-of-type(1){
				left:190px;
				background:#ccc;
			}
			.smallsa{
				width:100%;
				height:1062px;
				position:absolute;
				top:0px;
				left:0px;
				background:rgba(0,0,0,0.2);
				display:none;
			}
			.tab td{
				text-align:center;
			}
			
			
			
			ol li{
				float:left;
				padding:5px 10px;
				background:#2f4050;
				margin-right:5px;
			}
			ol li>a{
				text-decoration:none;
				color:#929da8;
				font-size:14px;
			}
			.aaa{
				padding-left:13px;
			}
			input{
			width: 100%;
			font-size:16px;
			text-align:center;
			}
			.yezi3{
				margin-top:22px;
			}
			
			
		  </style>
        <script>
            $(function(){
                $('.sh1').mouseover(function(event) {
                    $('.showhide1').css('display', 'block');
                });
                $('.sh1').mouseout(function(event) {
                    $('.showhide1').css('display', 'none');
                });
                $('.sh2').mouseover(function(event) {
                    $('.showhide2').css('display', 'block');
                });
                $('.sh2').mouseout(function(event) {
                    $('.showhide2').css('display', 'none');
                });
                $('.sh3').mouseover(function(event) {
                    $('.showhide3').css('display', 'block');
                });
                $('.sh3').mouseout(function(event) {
                    $('.showhide3').css('display', 'none');
                });
                $('.sh4').mouseover(function(event) {
                    $('.showhide4').css('display', 'block');
                });
                $('.sh4').mouseout(function(event) {
                    $('.showhide4').css('display', 'none');
                });
                
            })
        </script> 
        <script>
		  	function selectCheck(){
	    	   var judge = $("#selectCheck").val();
	    	   var objs = document.getElementsByName("items");
			   if(judge == 1){
				   for(var i = 0,l = objs.length;i < l;i++){
		    		   objs[i].checked = true;
		    	   }
				   $("#selectCheck").val(0);
	    	   }else{
	    		   for(var i = 0,l = objs.length;i < l;i++){
		    		   objs[i].checked = false;
		    	   }
	    		   $("#selectCheck").val(1);
	    	   }
	    	   
	    	   checkedShow();
	       }
		  	
		  	function checkedShow(){
		  		var str = "";
	    	    var number = 0;
	    	    var obj = document.getElementsByName("items");
				for(var i = 0,l = obj.length;i < l;i++){
					if(obj[i].checked){
						str += obj[i].value+",";
						number++;
					}
				}    	   
	    			
	    	    if(str == ""){
	    		   $(".yezi1").hide();
	    		   $('.smalltitle p').css('display', 'block');
	    		   $('.light3').css('display', 'inline-block');
	    		   $('.yezi3').css('display', 'inline-block');
	    	    }else{
	    		   $(".client_id").html(str);
	    		   $(".yezi1").show();
	    		   $("#number").html(number);
	    		   $('.light3').css('display', 'none');
	    		   $('.yezi3').css('display', 'none');
	    		   $('.checkok').css('display', 'block');
	    		   $('.del').css('display', 'block');
	    		   $('.shift').css('display', 'block');
	    		   $('.close2').css('display', 'block');
	    		   
	    		   $('.yezi1 .shanchu').css('display', 'block');
	    		   $('.yezi1 .bianji').css('display', 'block');
	    	   }
	    	    $("table").find(".tline2").each(function(){
					 if($(this).find("td[class=xuanze]").find("input[class=check1]").is(":checked")){	
					 }else{
						 $(this).find("input[class=vals]").show();
						 $(this).find("select[class=sels]").hide();
					 }
	    	    });
		  	}
		  	$(function(){
		  		$('.close2').click(function(event) {
		  			$(".yezi1").hide();
		  			$(".yezi").show();
		  			$('.light3').css('display', 'inline-block');
	    		   $('.yezi3').css('display', 'inline-block');
		  		});
		  	})
		  	 
		  </script>
    </head>
    <body>
    	<div class="bigbox">
    		<nav class="daohan">
                <ul>
                	<li class="sh1">
                        <a href="<%=basePath %>notice/findByAll.action"><p class="mline"><span class="smallicon" id="current1"></span><span class="navtxt">首页</span></p></a>  
                    </li>
                    <li>
                        <a href="<%=basePath %>client/qiangenzongcount.action?zhuizong=0"  id="sline"><p class="mline"><span class="smallicon" id="current"></span><span class="navtxt"  id="current2">用户开发</span></p></a>
                    </li>
                    <li>
                        <a href="<%=basePath %>client/selectDepOrSta.action?start=1">
                            <p class="mline">
                                <span class="smallicon" id="ziji11"></span>
                                <span class="navtxt">代理开发</span>
                            </p>
                        </a>
                    </li>
                    
                    <li>
                        <a href="<%=basePath %>approve/count.action?pageSize=0"><p class="mline"><span class="smallicon one2"></span><span class="navtxt">合同审批</span></p></a> 
                    </li>
                    <li>
                         <a href="<%=basePath%>page/pacts.jsp">
                             <p class="mline"><span class="smallicon one222"></span><span class="navtxt">审批详情</span></p>
                         </a>
                        
                    </li>
                    
                     <li>
                        <a href="<%=basePath %>Operate/count.action">
                             <p class="mline"><span class="smallicon" id="yunyin2"></span><span class="navtxt">运营管理</span></p>
                         </a>
                    </li>  
                    
                   <li>
                        <a href="#"><p class="mline"><span class="smallicon one3"></span><span class="navtxt">产品资源库</span></p></a>
                    </li>
                    <c:if test="${backstage == 1}">
                    	<li>
	                        <a href="<%=basePath %>client/findByAllGr.action"><p class="mline"><span class="smallicon one333"></span><span class="navtxt">后台管理</span></p></a>
	                    </li>
                    </c:if>
                </ul>
            </nav>
            
    		<div class="showbox">
                <h2>用 户 开 发
                	<span class="exit">
						<span class="ex1">姓名:${staff.staff_name}</span>
						<a href="../login/tuichustaff.action" class="ex2"><span class="exicon2"></span>切换账号</a>
						<a href="../login/tuichustaff.action" class="ex3"><span class="exicon3"></span>退出账号</a>
					</span>
                </h2>
                <div class="showbox2">
	    			<div style="width:98%;margin:50px auto 0px;">
                		<ol style="overflow:hidden;">
	                		<li style="background:#2a3845"><a href="<%=basePath %>client/qiangenzongcount.action?zhuizong=0" style="color:#fff;">正在追踪</a></li>
	                		<li><a href="<%=basePath %>client/qiangenzongcount.action?zhuizong=1">已开发</a></li>
	                	</ol>
                	</div>
	    			<div class="aaa">
		    			<div class="smalltitle">
		 					
							<!-- <a href="#" class="light3"><span class="imgmove imgmove2"><img src="../images/newkh.png" alt=""></span>&nbsp;&nbsp;新建客户</a> -->
							<div class="yezi3">
								<form action="javascript:selectBy()" method="post">
									<input id="selectBy" type="text" name="select" placeholder="&nbsp;&nbsp;&nbsp;&nbsp;请输入您要搜索的关键字" style="color:#bfbfbf;font-size:12px;border-radius: 16px;outline:none;border:1px solid #e7e7e8;height:36px;width:200px">
		 							<input type="submit"  value="搜 索" style="height:36px;width:70px;border-radius: 16px;outline:none;border:none;background:#1fd4fb;color:#fff;margin-left:10px;">
								</form>
		 					</div>
		 					
							 <span class="yezi1">
								 
								 <h4 class="checkok">已选择 <span style="color:#1fd4fb;" id="number"> </span> 项</h4>
								 
								<!-- <a href="javascript:deleteClient()" class="shanchu light4" style="width:115px;"><span class="imgmove imgmove2"><img src="../images/shanchubai.png" alt=""></span>&nbsp;&nbsp;删除</a> -->
								<a href="#" class="bianji" onclick="updateStaffPage()" style="line-height:36px;"><span class="imgmove"><img src="../images/bianjihui (1).png" alt="" ></span>&nbsp;&nbsp;编辑</a>
							 	<a href="#" class="tongguo"  style="left:50%;top: 12px;display:none;line-height:36px;" onclick="update()"><span class="imgmove"><img src="../images/pass.png" alt="" ></span>&nbsp;&nbsp;确认</a>
				    				<span class="close2">
				    					<img src="../images/guanbi.png" alt="">
				    				</span>
			    			 </span> 
		    			</div>
	    				
	    				<table class="tab">
	    					<tbody>
	    					<tr class="tline">
	    						<td class="xuanze"><input type="checkbox" class="check1" id="selectCheck" value="1" onclick="selectCheck()"></td>
	    						<td class="cname">编码</td>
			    		        <td>客户姓名</td>
			    		        <td>联系QQ</td>
			    		        <td>电话</td>
			    		        <td>来源渠道</td>
			    		        <td>追踪情况</td>
	    					</tr>
	    					 </tbody>
	    				</table>
	    				<div id="pageaaa" style="text-align:right;margin-top:50px;width:98%;"></div>
	    				<div class="M-box" style="width:50%;margin: 30px auto;padding-left: 350px;margin-bottom: 15px;"></div>
	    				
	    		</div>
	    	</div>
            </div>
    	</div> 
    	
    	
    	<div style="display: none">
    		<span class="client_id"></span>
    	</div>
    	<div class="smallsa"></div>
    	
    	
    	<div class="bianji1">
	    		<p>信息修改<img src="../images/guanbi.png" alt="" class="gb"></p>
	    		<form action="javascript:updateguanli()" method="post" onsubmit="return textas()">
	    			<input type="hidden" disabled="disabled" id="staffId" value="${staff.staff_id}">
	    			<p><span style="margin-right:43px;">姓 名</span><input type="text" disabled="disabled" id="xingming" value="${staff.staff_name}"></p>
	    			<p><span style="margin-right:28px;">手 机 号</span><input type="text" id="shoujihao" value="${staff.staff_phone}"><span>*</span></p>
	    			 <p><span style="margin-right:28px;">旧 密 码</span><input type="hidden" id="mimajiu" value="${staff.staff_password}"><input type="text" name="password" id="mimatian" value=""><span>*</span></p> 
	    			<p><span style="margin-right:28px;">新 密 码</span><input type="password" name="password" class="newpass" id="mima" value=""><span>*</span></p>
	    			<p><span style="margin-right:10px;">确 认密 码</span><input type="password" name="password" class="newspass" id="" value=""><span>*</span></p>
	    			<p><span style="margin-right:19px;">邮 箱 号</span><input type="text" id="youxiang" value="${staff.staff_email}"><span>*</span></p>
	    			<p><input type="button" value="取消" class="qi"><input type="submit" value="确定"></p>
	    		</form>
	    	</div>
    		<div class="smallsa"></div>
    	
    	
    </body>
    <script type="text/javascript">
    $('.M-box').pagination({
    	pageCount: ${PageCount},//总页数
		current: ${PageNum},//当前页码
	callback:function(api){
		var pageNum=api.getCurrent();
		var selectd="${select}";
        $.ajax({  
            type : "POST",  
            url : "<%=basePath%>client/findByqiangenzong.action",//路径   
            data : {  
            	pageNum : api.getCurrent(),
            	select  : selectd
            },
            success : function(data) {
            	var number=data[0].number;//总页数
            	api.setPageCount(number);//动态修改总页数为20页
            	var pageNum=data[0].pageNum;
            	var text="";
            	$('.tline2').remove();
              for(var i=0;i<data[0].list.length;i++){
            	  
		            
            	  text=$('<tr class="tline tline2" style="background:#fff;"><td class="xuanze" style="background:#fff;"><input type="checkbox" class="check1" value="'+data[0].list[i].client_id+'" name="items" onclick="checkedShow()"></td>'
       					+'<td class="cname" ><a style="text-decoration:none;color:#8c8c8d;font-size:14px;" href="../client/newrecord.action?id='+data[0].list[i].client_id+'">'+data[0].list[i].client_id+'</a></td><td>'+data[0].list[i].client_name+'</td>'	
       					+'<td>'+data[0].list[i].client_qq+'</td><td>'+data[0].list[i].client_phone+'</td><td>'+data[0].list[i].client_record+'</td>'
       					+'<td class="zhuizong"><input type="text"  class="vals" value="'+data[0].list[i].client_remarks+'" style="border:none;background:none;" disabled="disabled"><select style="display:none;" class="sels"><option value="正在跟踪">正在跟踪</option><option value="已开发">已开发</option></select></td>'
       					+'</tr>');
                    $('tbody').append(text);
                  }
            }
        });  
        
    }
},function(api){
    var pageNum;
    var selectd="${select}";
    $.ajax({  
        type : "POST",  
        url : "<%=basePath%>client/findByqiangenzong.action",//路径  
        data : {  
        	pageNum : api.getCurrent(),
        	select  : selectd
        },
        success : function(data) {		     
        	var number=data[0].number;//总页数
        	api.setPageCount(number);//动态修改总页数为20页
        	var pageNum=data[0].pageNum;
        	var text="";  
            for(var i=0;i<data[0].list.length;i++){
            	text=$('<tr class="tline tline2" style="background:#fff;"><td class="xuanze" style="background:#fff;"><input type="checkbox" class="check1" value="'+data[0].list[i].client_id+'" name="items" onclick="checkedShow()"></td>'
       					+'<td class="cname" ><a style="text-decoration:none;color:#8c8c8d;font-size:14px;" href="../client/newrecord.action?id='+data[0].list[i].client_id+'">'+data[0].list[i].client_id+'</a></td><td>'+data[0].list[i].client_name+'</td>'	
       					+'<td>'+data[0].list[i].client_qq+'</td><td>'+data[0].list[i].client_phone+'</td><td>'+data[0].list[i].client_record+'</td>'
       					+'<td class="zhuizong"><input type="text"  class="vals" value="'+data[0].list[i].client_remarks+'" style="border:none;background:none;" disabled="disabled"><select style="display:none;" class="sels"><option value="正在跟踪">正在跟踪</option><option value="已开发">已开发</option></select></td>'
       					+'</tr>');
                         $('tbody').append(text);
                  }  
        }
    });
	});
    function textas(){
    	var shoujihao=$("#shoujihao").val();
    	var mima=$("#mimatian").val();
    	var mimajiu=$("#mimajiu").val();
    	var newpass=$(".newpass").val();
    	var newspass=$(".newspass").val();
    	var p=/\s/;
    	if(shoujihao==""||p.test(shoujihao)){
    		alert("请填写手机号！");
    		return false;
    	}else if(mima!=mimajiu){
    		alert("输入的密码不一致！");
    		return false;
    	}else if(newpass==mima){
    		alert("输入的密码不能与旧密码一致！");
    		return false;
    	}else if(newpass==""||p.test(newpass)){
    		alert("请输入新密码！");
    		return false;
    	}else if(newspass==""||p.test(newspass)){
    		alert("请再次输入新密码！");
    		return false;
    	}else if(newspass!=newpass){
    		alert("与重新设置的密码不相同，请重新输入！");
    		return false;
    	}
    	return true;
    }
    function updateguanli(){
    	var url="${pageContext.request.contextPath}/staff/qianupdate.action";
		var pam={
				staff_id:$("#staffId").val(),
				staff_password:$("#mima").val(),
				staff_phone:$("#shoujihao").val(),
				staff_userName:$("#xingming").val(),
				staff_email:$("#youxiang").val()	
				};
		
		$.post(url,pam,function(data){		
				location="${pageContext.request.contextPath}/client/selectDepOrSta.action";
	});
    }
    
    $('.ex1').click(function(){
    	$('.bianji1').css('display','block');
    	$('.smallsa').css('display','block');
    })
    $('.gb').click(function(){
    	$('.bianji1').css('display','none');
    	$('.smallsa').css('display','none');
    })
     $('.qi').click(function(){
    	$('.bianji1').css('display','none');
    	$('.smallsa').css('display','none');
    })   	
    	function deleteClient(){
    		var client_id = $(".client_id").html();
    		client_id = client_id.substring(0,client_id.length-1);
    		$.ajax({
				type:"post",
				url:"<%=basePath %>client/deletes.action",
				data:"ids="+client_id,
				success:function(data){
					alert(data);
					if(data == "删除成功"){
						location.href= "<%=basePath%>/client/qiangenzongcount.action?zhuizong=0";
					}
				},
				error:function(e){
				}

	   		 });
    	}
    	function selectBy(){
    		var select = $("#selectBy").val();
    		if(select == ""){
    			alert("不能为空");
    			return;
    		}
    		location.href="../client/qiangenzongcount.action?select="+select+"&&zhuizong=0";
    	}
    	function updateStaffPage(){
    		$(".tongguo").show();
    		$("table").find(".tline2").each(function(){
				 if($(this).find("td[class=xuanze]").find("input[class=check1]").is(":checked")){	
					$(this).find("input[class=vals]").css("display","none");
					var zhuizong=$(this).find("td[class=zhuizong]").find("input").val();
					$(this).find("select[class=sels]").css("display","inline");
					var options1 = $(this).find("select[class=sels] > option");
					//options是集合，数组的意思,i指索引,option指当前的对象
					 $.each(options1,function(i,option){
						if(option.text ==zhuizong )
						{
							option.selected= true;
						}
					}); 	
				 }else{
					 
				 }
		});
 		}
    	function update(){
    		$("table").find(".tline2").each(function(){
			if($(this).find("td[class=xuanze]").find("input[class=check1]").is(":checked")){
				var client_id=$(this).find("td[class=xuanze]").find("input[class=check1]").val();
				var upclient_remarks=$(this).find("select[class=sels] option:selected").val();
			$.ajax({
 				type:"post",
 				data:"client_id="+client_id+"&client_remarks="+upclient_remarks,
 				url:"<%=basePath %>client/update.action",
 				success:function(data){
 					location.href= "<%=basePath%>/client/qiangenzongcount.action?zhuizong=0";
 				},
 				error:function(e){
 					alert("发生未知错误请刷新页面");
 				}

	   		 });
			}
    		 });
    	}

 	 	  
 	 	  
    </script>
    
    <script>
         $(function(){  
        	 
        	  //判断浏览器是否支持placeholder属性
        	  supportPlaceholder='placeholder'in document.createElement('input'),
        	 
        	  placeholder=function(input){
        	 
        	    var text = input.attr('placeholder'),
        	    defaultValue = input.defaultValue;
        	 
        	    if(!defaultValue){
        	 
        	      input.val(text).addClass("phcolor");
        	    }
        	 
        	    input.focus(function(){
        	 
        	      if(input.val() == text){
        	   
        	        $(this).val("");
        	      }
        	    });
        	 
        	  
        	    input.blur(function(){
        	 
        	      if(input.val() == ""){
        	       
        	        $(this).val(text).addClass("phcolor");
        	      }
        	    });
        	 
        	    //输入的字符不为灰色
        	    input.keydown(function(){
        	  
        	      $(this).removeClass("phcolor");
        	    });
        	  };
        	 
        	  //当浏览器不支持placeholder属性时，调用placeholder函数
        	  if(!supportPlaceholder){
        	 
        	    $('input').each(function(){
        	 
        	      text = $(this).attr("placeholder");
        	 
        	      if($(this).attr("type") == "text"){
        	 
        	        placeholder($(this));
        	      }
        	    });
        	  }
        	 
        	});
         </script>
</html>
